<template>
    <div>
        <h1>显示页面</h1>
        券标题:<input type="text" v-model="queryinfo.title" />
        适用门店:
        <select>
            <option value="">请选择</option>
            <option value="北京八维分店">北京八维分店</option>
            <option value="南京分店">南京分店</option>
            <option value="合肥分店">合肥分店</option>
        </select>
        <input type="button" value="查询" @click="list" />
        <table border>
            <tbody>
                <tr>
                    <td>类型</td>
                    <td>标题</td>
                    <td>副标题</td>
                    <td>图片</td>
                    <td>剩余库存</td>
                    <td>每人限领</td>
                    <td>使用条件</td>
                    <td>减免金额</td>
                    <td>有效期</td>
                    <td>使用业务</td>
                    <td>使用须知</td>
                    <td>适用门店</td>
                    <td>服务电话</td>
                    <td>操作</td>
                </tr>
                <tr v-for="item in data.list">
                    <td>{{ item.shopType }}</td>
                    <td>{{ item.title }}</td>
                    <td>{{ item.fTitle }}</td>
                    <td><img :src="item.photo" width="100" height="100" /></td>
                    <td>{{ item.sum }}</td>
                    <td>{{ item.xl }}</td>
                    <td>{{ item.money }}</td>
                    <td>{{ item.jmmoney }}</td>
                    <td>{{ item.beginTime }}-{{ item.endTime }}</td>
                    <td>{{ item.yewu }}</td>
                    <td>{{ item.desc }}</td>
                    <td>{{ item.md }}</td>
                    <td>{{ item.phone }}</td>
                    <td>
                        <input type="button" value="删除" @click="del(item.id)" />
                        <input type="button" value="修改" @click="upd(item.id)" />
                    </td>
                </tr>
            </tbody>
        </table>
        <span>共{{ data.count }}条</span>
        <span>共{{ data.page }}页</span>
        <span>{{ queryinfo.index }}/{{ data.page }}</span>
        <input type="button" value="首页" @click="gopage(1)" />
        <input type="button" value="上一页" @click="gopage(queryinfo.index-1)" />
        <input type="button" value="下一页" @click="gopage(queryinfo.index+1)" />
        <input type="button" value="尾页" @click="gopage(data.page)" />
    </div>
</template>

<script setup lang="ts">
import {ref,reactive} from 'vue'
import { onMounted } from 'vue';
import axios from 'axios'

let data=ref({
    list:[],
    count:0,
    page:0
})

let queryinfo=reactive({
    title:'',
    md:'',
    index:1,
    size:2
})

onMounted(()=>{
    list();
})

const list=()=>{
    axios({
        url:"https://localhost:7248/api/Shop/GetAll",
        method:'get',
        params:{queryinfo}
    })
    .then(res=>{
        console.log(res);
        data.value.list=res.data.list;
        data.value.count=res.data.count;
        data.value.page=res.data.page;
    })
}

const gopage=(num:any)=>{
    if(num<1){
        queryinfo.index=1
    }
    if(num>data.value.page){
        queryinfo.index=data.value.page;
    }
    queryinfo.index=num;
    list();
}

const del=(id)=>{
    var s=confirm("确认删除吗?")
    if(s==true){
        axios({
            url:'https://localhost:7248/api/Shop/Delete',
            method:'delete',
            params:{id:id}
        })
        .then(res=>{
            if(res.data>0){
                alert('修改成功');
                list();
            }
            else{
                alert('修改失败')
                return;
            }
        })
    }
}

const upd=(id:any)=>{
    localStorage["id"]=id;
    location.href="/shopupdate"
}

</script>

<style scoped>

</style>